// tinymce.init({
// 你需要将页面中的那个元素替换为富本编辑器
//selector:'textarea'//容器 ,可使用css选择器
// })
// 上述配置,是将多行文本框替换为富文本编辑器
initEditor();

// 页面处理,获取分类
axios.get('/my/category/list').then(res => {
    // console.log(res.data);
    let { status, data } = res.data;
    if (status === 0) {
      let str = '';
      data.forEach(item => {
        str += `<option value="${item.id}">${item.name}</option>`;
      });
      // 把option放到select中
      $('select[name=cate_id]').append(str); // html() 会覆盖select里面的所有代码，如果不想覆盖，则使用append
      // 更新渲染
      let form = layui.form;
      form.render('select');
    }
  });
// axios.get('/my/category/list').then(res =>{
//     let {status,data}=res.data;
//     if(status ===0){
//         let str ='';
//         data.forEach(item =>{
//             str +=` <option   value="${item.id}">${item.name}</option>`
//         })
//         // 如果HTML()会覆盖select里面的所有代码,如果不想覆盖,则使用append
//         $('select[name=cate_id]').append(str);
//         // 更新渲染
//         let form=layui.form;
//         form.render('select')
//     }
// })

// 封面处理 - 初始的剪裁效果
// 1. 初始化剪裁框
// 1.1) 初始化图片裁剪器
var image = $('#image')
// 1.2) 裁剪选项
var options = {
  aspectRatio: 400 / 280,
  preview: '.img-preview'
}
// 1.3) 初始化裁剪区域
image.cropper(options);

// 2. 点击 “选择封面” 能够选择图片
$('button:contains("选择封面")').click(function () {
  $('#file').trigger('click');
});

// 3. 图片切换的时候，更换剪裁区的图片
$('#file').change(function () {
  if (this.files.length > 0) {
    // 3.1) 找到文件对象
    var fileObj = this.files[0];
    // 3.2) 创建url
    var url = URL.createObjectURL(fileObj);
    // 3.3) 更换图片
    image.cropper('replace', url);
  }
});



$('form').on('submit',function(e){
    e.preventDefault();
    //this 就是DOM的对象 
    let fd = new FormData(this);
    // 修改content   值网上查的
    fd.forEach((item, index)=>{console.log(item,index)})
    fd.set('content', tinyMCE.activeEditor.getContent());
    // 图片需要裁剪 剪裁后,装换成文件对象格式 追加到fd中
    let canvas =image.cropper('getCroppedCanvas',{width: 400, height: 280});
    // 转换文件对象格式
    console.log(canvas)
    canvas.toBlob(function(blob){
        fd.append('cover_img',blob);
// 检测fd中的数据
// fd.forEach((item, index)=>{console.log(item,index)})
axios.post('/my/category/add',fd).then(res =>{
    let  {status, message}=res.data;
    if(status ===0){
        layer.msg(message)
    }
   })
 });
})